<template>
  <div>
    <!-- 背景图 -->
    <div class="position">
      <img src="/img/position/position_01.jpg" alt="" style="width: 100%" />
      <!-- stand-title 上面的文字 -->
      <div class="stand">
        <div class="Stand-title container">
          <div>
            <a href="#" class="beijing">北京</a>
            <div><a href="" style="font-size: 32px">位置</a></div>
          </div>
          <div class="items" style="font-size: 12px">
            <a href="#">须知信息</a>
            <a href="#">让我们为您妥帖做好安排</a>
            <a href="#">交通枢纽与路线指引</a>
          </div>
        </div>
      </div>
    </div>
    <!-- 图片下面的黑色部分 -->
    <div class="second">
      <div class="container">
        <div class="addr">中国北京朝阳区亮马桥路 48 号，邮编：100125</div>
        <hr style="width: 60%; margin: auto; margin-bottom: 20px" />
        <div class="pho">
          <p class="phone">+86 (10) 5695 8888</p>
          <hr style="width: 25%; margin: auto" />
        </div>
        <div class="introduce">
          <p>
            酒店位于朝阳区东北部核心商圈亮马河畔，坐落北京最具活力的商务住宅区。仅需数分钟即可抵达798艺术区、第三使馆区及三里屯娱乐区。前往北京首都国际机场及城中最热门景点长城均十分便捷，亦可前往天安门广场、故宫或
            798 艺术区参观游览，这些景点均短途驱车即达。
          </p>
        </div>
      </div>
      <!-- 白色框框 -->
      <div class="container" style="padding:70px">
          <div class="cantact_us">
           <span style="margin:10px">让我们为您妥帖安排交通服务。</span>
           <a href="" style="color:black;font-size:0.75rem;line-height:1em;">+86 (10) 5695 8888</a>
           <a class="btn">联系我们</a>
          </div>
      </div>
    </div>
      <div class="container_s">
         <!-- 须知信息 -->
        <div class="must_msg">
          <p style="font-size:22px;padding:40px 0 15px 0;letter-spacing: 15px;">须知信息</p>
        </div>
        <hr >
        <div class="text">
           <div style="margin:0 0 15px"><span style="font-size:12px;letter-spacing:10px;font-weight:700">有效护照</span></div>
           <div class="table_list">从您预计入境的时间起算，您的护照至少要有六个月的有效期。护照上至少应有两页空白页供移民局盖章。</div>
        </div>

         <hr >
        <div class="text">
           <div style="margin:0 0 15px"><span style="font-size:12px;letter-spacing:10px;font-weight:700">中文地址</span></div>
           <div class="table_list">为方便您出行，我们在此列出了酒店的中文名称和地址。您可以向出租车司机出示此地址，或者在选择任何其他交通方式时使用。北京四季酒店，北京市朝阳区亮马桥路 48 号，邮编：100125</div>
        </div>

        <hr >
        <div class="text">
           <div style="margin:0 0 15px"><span style="font-size:12px;letter-spacing:10px;font-weight:700">签证要求</span></div>
           <div class="table_list">要入境中国，您需要持有效签证。中国对 53 个国家/地区的公民实施 144 小时的过境免签政策，其他国家/地区的公民需要在旅行前申请签证。您可以在网上了解更多信息，或者致电 +86 10 5609 5400 联系中国出入境边检总站，查询您需满足的具体要求。</div>
        </div>


        <hr >
        <div class="text">
           <div style="margin:0 0 15px"><span style="font-size:12px;letter-spacing:10px;font-weight:700">违禁品</span></div>
           <div class="table_list">中国不允许携带某些物品入境，如携带，将会在来客抵达机场时没收。请上网查询禁止物品的完整清单。</div>
        </div>

        <div class="text">
           <div style="margin:0 0 15px"><span style="font-size:12px;letter-spacing:10px;font-weight:700">语言服务</span></div>
           <div class="table_list">本地出租车司机大都不会说英语，也看不懂英语。北京四季酒店礼宾部很乐意帮助翻译您在入住期间可能需要的任何地址。</div>
        </div>

         <!-- 让我们为您妥帖做好安排 -->
        <div class="must_msg">
          <p style="font-size:22px;padding:40px 0 15px 0;letter-spacing: 15px;">让我们为您妥帖做好安排</p>
        </div>
        <hr >
        <div class="text">
           <div style="margin:0 0 15px"><span style="font-size:12px;letter-spacing:10px;font-weight:700">机场接送服务</span></div>
           <div class="table_list">为了让您顺利抵达酒店，我们可以安排私人豪华轿车服务将您直接送到酒店，还可提供免费接机服务。此外，也可安排出租车和汽车租赁服务。更多详情，请致电 +86 10 5695 8930 联系礼宾部。</div>
        </div>

         <hr >
        <div class="text">
           <div style="margin:0 0 15px"><span style="font-size:12px;letter-spacing:10px;font-weight:700">豪车轿车服务</span></div>
           <div class="table_list">豪华轿车按小时计费，内有免费 Wi-Fi、瓶装水、冰镇湿毛巾和数字设备充电站。</div>
        </div>

        <hr >
        <div class="text">
           <div style="margin:0 0 15px"><span style="font-size:12px;letter-spacing:10px;font-weight:700">私人导游</span></div>
           <div class="table_list">想像本地人一样深入探索这座广袤城市？我们的私人导游可为您定制独家体验。更多详情，请致电 +86 10 5695 8930 联系礼宾部。</div>
        </div>


         <!-- 交通枢纽与路线指引 -->
        <div class="must_msg">
          <p style="font-size:22px;padding:40px 0 15px 0;letter-spacing: 15px;">交通枢纽与路线指引</p>
        </div>
        <hr >
        <div class="text_1">
           <div style="margin:0 0 15px"><span style="font-size:12px;letter-spacing:10px;font-weight:700">北京首都国际机场 (PEK)</span></div>
           <div class="table_list"></div>
        </div>

         <hr >
        <div class="text_1">
           <div class="traf">
             <span style="font-size:12px;letter-spacing:10px;font-weight:700">行程</span>
             <span style="font-size:12px;font-weight:700;letter-spacing: 1px">25分钟</span>
            </div>
           <div style="font-size:12px;font-weight:700;letter-spacing: 1px;">在三元桥站下车，换乘地铁 10 号线，然后在亮马桥站下车。B 出口离酒店最近。</div>
        </div>

        <hr >
        <div class="text_1">
           <div class="traf">
             <span style="font-size:12px;letter-spacing:10px;font-weight:700">距离</span>
             <span style="font-size:12px;font-weight:700;letter-spacing: 1px">21 公里 / 13 英里</span>
            </div>
        </div>
        
        <div class="text_1">
           <div style="margin:0 0 15px"><span style="font-size:12px;letter-spacing:10px;font-weight:700">北京大兴国际机场 (PKX)</span></div>
           <div class="table_list"></div>
        </div>

         <div class="text_1">
           <div class="traf">
             <span style="font-size:12px;letter-spacing:10px;font-weight:700">行程</span>
             <span style="font-size:12px;font-weight:700;letter-spacing: 1px">80分钟</span>
            </div>
           <div style="font-size:12px;font-weight:700;letter-spacing: 1px;">在草桥站下车，换乘地铁 10 号线，然后在亮马桥站下车。B 出口离酒店最近。</div>
        </div>

        <hr >
        <div class="text_1">
           <div class="traf">
             <span style="font-size:12px;letter-spacing:10px;font-weight:700">距离</span>
             <span style="font-size:12px;font-weight:700;letter-spacing: 1px">60 公里 / 38 英里</span>
           </div>
        </div>
        
       
      </div>
    

    

      
  </div>
       
</template>

<script>
export default {};
</script>

<style scoped>
* {
  margin: 0px;
  padding: 0px;
  /* user-select: none; */
  
}
.container {
  width: 80%;
}
.position {
  position: relative;
}
.stand {
  width: 100%;
  padding: 30px 0 20px 0;
  position: absolute;
  background-color: black;
  top: 0px;
  text-align: center;
  box-sizing: border-box;
}
a {
  text-decoration-style: none;
  color: white;
  display: inline-block;
  padding-left: 30px;
  margin: 0 20px 20px;
  border: 0;
}

.Stand-title {
  background-color: black;
  text-align: center;
  padding-left: 100px;
  padding-right: 100px;
  /* padding-bottom: 30px; */
}
.beijing {
  font-size: 16px;
  /* line-height: 24px; */
  letter-spacing: 0.5px;
  font-style: italic;
}
.items {
  margin-top: 12px;
}
.second {
  background-color: black;
  color: white;
  text-align: center;
  padding-left: 200px;
}
.addr {
  letter-spacing: 0.25rem;
  font-size: 0.75rem;
  line-height: 1.5em;
  padding: 20px 0 20px 0;
}
.phone {
  letter-spacing: 0.25rem;
  font-size: 0.75rem;
  line-height: 1.5em;
}
.introduce {
  margin: 0 auto;
  width: 86%;
  padding-top: 60px;
  font-size: 1.375rem;
  letter-spacing: 0.23rem;
  line-height: 1.5em;
}
.pho:hover {
  transition: 1s;
  color: gray;
}
.cantact_us {
  background-color: white;
  color: black;
  padding: 20px ;
  width: 80%;
  height: 40px;
  margin-top: 75px;
  line-height: 40px;
  
}
.btn{
  display: inline-block;
  margin-left: 100px;
  padding:0 20px 0 20px;
  font-size: 8px;
  color: white;
  border: 1px solid black;
  background-color: black;
  line-height: 25px;
  border-radius: 4px;
  
}
.btn:hover{
  background-color: white;
  color: black;
  transition: 1.5s;
}
.must_msg{

  background-color: white;
  width: 100%;
  text-align: center;
  line-height: 80px;
}
.container_s{
  width: 60%;
  margin: 0 auto;
}
.text{
  padding: 30px 0 55px 0;
  line-height: 30px;
  border-bottom: 1px solid black;
}
.text_1{
  padding: 30px 0 40px 0;
  line-height: 30px;
  border-bottom: 1px solid black;
}
.table_list{
  font-size: 17px;
  letter-spacing: 1px;
}
.traf{
   margin:0 0 15px;
   display: flex;
   justify-content: space-between;
}
</style>
